
<script  setup>
import axios from 'axios'
import { onMounted, ref } from 'vue'
import { useStore } from 'vuex'
import { ElMessage } from 'element-plus'
const store = useStore()

const uid = ref(store.state.userStore.userInfo.data.id)
const options = ref([])
const title = ref('')
const value = ref('')
const mdcontent = ref('')
const article = ref('')
const time = ref(new Date())

const post = () => {
  ElMessage.success('发表成功')
  axios.get('api/mycontroller7/mymethod7/' + uid.value + '/' + time.value + '/' + mdcontent.value + '/' + title.value).then((res) => {
    article.value = res.data
    console.log(article.value)
  })
}

onMounted(() => {
  axios.get('api/mycontroller6/mymethod6/').then((res) => {
    options.value = res.data
    console.log(options.value)
  })
})
</script>

<template>
  <div class="common-layout">
    <el-container>
      <el-header class="head">
        <div class="select">
           <el-select v-model="value" class="m-2" placeholder="请选择分类" size="large">
    <el-option
      v-for="item in options"
      :key="item.id"
      :value="item.catename"
    />
  </el-select>
        </div>

        <div class="input"><el-input   v-model="title" placeholder="请输入标题" /></div>
      </el-header>

      <el-main class="main">
     <el-input
    v-model="mdcontent"
    :rows="2"
    type="textarea"
    placeholder="请输入内容"
  />
      </el-main>
    </el-container>
    <el-button @click="post" type="primary">Primary</el-button>
  </div>
</template>

<style scoped>
.head{
  display: flex;
  justify-content: space-between;
}

.head .el-input{
  margin-top: 20px;
  width: 250px;
  height: 40px;
}
.main{
  background-color: white;
  height: 500px;
}
.select{
  display: flex;
  margin-top: 20px;
  margin-right: 100px;
}
.input{
  display:flex;
}
.main .el-input{

}
</style>
